@import './reset.scss';
@import './elements/iconfont.scss';
@import "./mixins/_layout.scss";
@import "./mixins/standard.scss";
@import "./elements/buttons.scss";

$width-limit: 1140px;
$height-site-header: 54px;

html,
body,
.site {
  min-height: 100%;
}

.site {
  background: #f5f6f9;
  line-height: 1.4;
}

.site-header {
  width: 100%;
  position: relative;
  z-index: 7;
  padding-bottom: $height-site-header;
  margin-bottom: 20px;

  .is-top-sticky {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: $height-site-header;
    background: rgba(255, 255, 255, .9);
  }

  .site-branding {
    width: $width-limit;
    line-height: $height-site-header;
    margin: 0 auto;
    @include flex-justify;

    .site-title {
      font-size: 40px;
      font-weight: 300;
    }

    .size-justfiy {
      flex: 1;
    }

    .menu-top {
      padding-left: 40px;

      .link-route {
        padding: 0 20px;
      }
    }

    .buttons-seperate {
      margin-right: -20px;

      .btn {
        margin-right: 20px;
      }

      .btn-draft {
        color: #fff;
        border-radius: 50px;
        border: 1px solid #4285f4;
        background-image: linear-gradient(top, rgb(67, 135, 253), rgb(70, 131, 234));

        .iconfont {
          margin-right: 4px;
        }
      }
    }
  }
}


.site-content {
  width: $width-limit;
  margin: 0 auto;
  @include flex-justify;

  .content-area {

    &.size-justfiy {
      flex: 1;
    }
  }

  .widget-area {
    width: 270px;
  }
}

.site-footer {
  color: #90949c;
  font-size: $secondSize;
  background-color: #fff;
  border-top: 1px solid #ccc;

  .site-info {
    width: $width-limit;
    margin: 0 auto;
    padding: 20px 0;
    @include flex-justify;
    align-items: center;

    .size-justfiy{
      flex: 1;
    }

    .footer-right {
      text-align: right;

      .site-title {
        font-size: 40px;
      }
      small {
        font-size: $secondSize;
      }
    }

    .footer-left {
      margin-top: -20px;

      & > p {
        margin-top: 15px;
      }
    }

    .ipc a{
      color: $negligibleColor;
    }
  }
}
